<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich">

<ui:composition template="/templates/main.xhtml">
    <ui:define name="body">
    
        <a4j:form>
			<rich:panel>
		        <f:facet name="header">
		        	<h:outputText value="Create Customer"/>
		        </f:facet>
		        
		        <rich:messages styleClass="msg-warning" globalOnly="true">
					  <f:facet name="warnMarker">
			            &nbsp;
				      </f:facet>
				</rich:messages>
		        
		        <h:panelGrid columns="5" title="Customer" columnClasses="gridLabel,gridValue,gridSpace,gridLabel,gridValue">
			        <h:outputText value="Name: " />
					<h:inputText value="#{customerController.name}" id="name" required="true" />
					
					<h:outputText value="&nbsp;" />
					
					<h:outputText value="Phone: " />
					<h:inputText value="#{customerController.phone}" id="phone" required="true"/>
					
					<h:outputText value="&nbsp;" />
					<rich:message for="name" styleClass="msg-warning" />
					<h:outputText value="&nbsp;" />
					<h:outputText value="&nbsp;" />
					<rich:message for="phone" styleClass="msg-warning" />
					
					<h:outputText value="Address: " />
					<h:inputText value="#{customerController.adresse}" id="adresse" required="true"/>
					<h:outputText value="&nbsp;" />
					<h:outputText value="TaxId: " />
					<h:inputText value="#{customerController.taxId}" id="taxId" required="true">
						<f:validateLongRange minimum="0" maximum="100"/>
					</h:inputText>
					
					<h:outputText value="&nbsp;" />
					<rich:message for="adresse" styleClass="msg-warning" />
					<h:outputText value="&nbsp;" />
					<h:outputText value="&nbsp;" />
					<rich:message for="taxId" styleClass="msg-warning" />
					
					<h:outputText value="City: " />
					<h:inputText value="#{customerController.city}" id="city" required="true"/>
					<h:outputText value="&nbsp;" />
					<h:outputText value="State: " />
					<h:inputText value="#{customerController.state}" id="state" required="true"/>
					
					<h:outputText value="&nbsp;" />
					<rich:message for="city" styleClass="msg-warning" />
					<h:outputText value="&nbsp;" />
					<h:outputText value="&nbsp;" />
					<rich:message for="state" styleClass="msg-warning" />
					
					<h:outputText value="Zip: " />
					<h:inputText value="#{customerController.zip}" id="zip" required="true">
						<f:validateLongRange minimum="0" maximum="9999"/>
					</h:inputText>
					<h:outputText value="&nbsp;" />
					<h:outputText value="&nbsp;" />
					<h:outputText value="&nbsp;" />
					
					<h:outputText value="&nbsp;" />
					<rich:message for="zip" styleClass="msg-warning" />
					
					<f:facet name="footer"> 
						<a4j:commandLink styleClass="button-blue" style="padding:6px 20px;" action="#{customerController.save}" value="Save"/>
						<h:commandLink styleClass="button-blue" style="padding:6px 20px;" action="cancel" value="Cancel"/>
					</f:facet>
				</h:panelGrid>
	    	</rich:panel>

		</a4j:form>
    </ui:define>
</ui:composition>    
    
</html>